import 'package:flutter/material.dart';
import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart';
import 'package:amplatzer/services/ScreenAdapter.dart';

class HomePage extends StatefulWidget {
  HomePage({Key? key}) : super(key: key);

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  // 轮播图
  Widget _swiperWidget () {
    List<Map> imgList = [
      {"url": 'images/1.jpg'},
      {"url": 'images/1.jpg'},
      {"url": 'images/1.jpg'},
    ];

    return Container(
      child: AspectRatio(
        aspectRatio: 2/1,
        child: Swiper(
          itemBuilder: (BuildContext context, int index) {
            return Card(
              margin: EdgeInsets.all(ScreenAdapter.width(10)),
              shadowColor: Colors.yellow, // 阴影颜色
              elevation: ScreenAdapter.width(10), // 阴影高度
              child: new Image.asset(
                imgList[index]["url"],
                fit: BoxFit.fill,
              ),
            );
          },
          itemCount: imgList.length,
          pagination: new SwiperPagination(),
          autoplay: true,
        ),
      ),
    );
  }

  Widget _titleWidget(value) {
    return Container(
      height: ScreenAdapter.height(32),
      margin: EdgeInsets.only(left: ScreenAdapter.width(20)),
      padding: EdgeInsets.only(left: ScreenAdapter.width(20)),
      decoration: BoxDecoration(
        border: Border(
          left: BorderSide(
            color: Colors.red,
            width: ScreenAdapter.width(4)
          ),
        ),
      ),
      child: Text(
        value,
        style: TextStyle(
          color: Colors.black54
        ),
      ),
    );
  }

  Widget _guessLikeWidget() {
    // 猜你喜欢Widget
    return Container(
      width: double.infinity,   // 自适应宽度
      height: ScreenAdapter.height(210),
      child: ListView.builder(
        scrollDirection: Axis.horizontal,  // 水平滚动
        itemBuilder: (context, index) {
          return Card(
            margin: EdgeInsets.all(ScreenAdapter.width(8)),
            shadowColor: Colors.yellow, // 阴影颜色
            elevation: ScreenAdapter.width(3), // 阴影高度
            child: Column(
              children: [
                Container(
                  padding: EdgeInsets.all(ScreenAdapter.height(5)),
                  height: ScreenAdapter.height(140),
                  width: ScreenAdapter.width(140),
                  child: Image.asset("images/1.jpg", fit: BoxFit.fill),
                ),
                Container(
                  height: ScreenAdapter.height(30),
                  child: Text("第${index+1}条"),
                ),
              ]
            ),
          );
        },
        itemCount: 10,
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      // 所有内容来个距离10的padding
      padding: EdgeInsets.all(ScreenAdapter.height(10)),
      children: [
        this._swiperWidget(),
        SizedBox(height: 10),
        this._titleWidget("猜你喜欢"),
        this._guessLikeWidget(),
        this._titleWidget("热门推荐"),
      ],
    );
  }
}